<template>
	<view class="index">
		<uni-forms :rules="rules" :value="formData" ref="form" validate-trigger="bind" err-show-type="undertext">
			<uni-forms-item class="formItem" label-width="110" name="company" label="填写公司名称：">
				<input type="text" v-model="formData.company" class="uni-input"
					@blur="binddata('company', $event.detail.value)" placeholder="请填写" />
			</uni-forms-item>
			<uni-forms-item class="formItem" label-width="110" @click="picker" name="addr" label="省-市-区：">
				<picker @change="selCity" mode="region">
					<view class="addText" :class="{active:formData.province}">
						{{formData.province?`${formData.province}-${formData.city}-${formData.area}`:'请选择'}}
					</view>
				</picker>
			</uni-forms-item>
			<uni-forms-item class="formItem" label-width="110" name="addDetailes" label="详细地址：">
				<input type="text" v-model="formData.addDetailes" class="uni-input"
					@blur="binddata('addDetailes', $event.detail.value)" placeholder="请填写" />
			</uni-forms-item>
			<uni-forms-item class="formItem" label-width="110" name="atten" label="联系人：">
				<input type="text" v-model="formData.atten" class="uni-input"
					@blur="binddata('atten', $event.detail.value)" placeholder="请填写" />
			</uni-forms-item>
			<uni-forms-item class="formItem" label-width="110" name="phone" label="联系电话：">
				<input type="number" v-model="formData.phone" class="uni-input"
					@blur="binddata('phone', $event.detail.value)" placeholder="请填写" />
				<!-- <button type="default"	open-type="getPhoneNumber" @getphonenumber="getphonenumber">获取手机号</button> -->
			</uni-forms-item>
			<uni-forms-item class="formItem border-none" label-width="110" name="description" label="公司简介：">
			</uni-forms-item>
			<textarea type="text" v-model="formData.introduce" class="uni-textarea"
				@blur="binddata('introduce', $event.detail.value)" placeholder="请填写" />
			<uni-forms-item class="formItem border-none" label-width="110" name="introduce" label="公司Logo：">
			</uni-forms-item>
			<uni-file-picker v-model="logo" fileMediatype="image" mode="grid" :auto-upload="false"
				@select="select('logo',$event)" @progress="progress" @success="success" @fail="fail" />
			<uni-forms-item class="formItem border-none" label-width="110" name="description" label="公司资质：">
			</uni-forms-item>
			<uni-file-picker v-model="qualification" fileMediatype="image" :auto-upload="false" mode="grid"
				@select="select('qualification',$event)" @progress="progress" @success="success" @fail="fail" />
			<text class="tips">公司认证申请需要缴纳199元认证费，请熟知哦！</text>
			<view class="shop">
				<form @submit="submitSub" report-submit='true'>
					<button class="button" formType="submit" @click="submitForm('form')">申请创建</button>
				</form>
				<!-- 购买 -->
			</view>
			<!-- <button class="button" v-if="!isprice" @click="submitForm('form')">申请创建1</button> -->
		</uni-forms>
		<!-- <view class="modal" v-if="confirm">
			<view class="modal-box">
				<view class="content">
					<text>您还需缴纳199元入住费，即可创建成功！</text>
				</view>
				<view class="button-box">
					<button type="default" @click="cancelConfirm" class="cancel">取消</button>
					<button type="default" @click="confirmModal" class="confirm">确认</button>
				</view>
			</view>
		</view> -->
		
	</view>
</template>

<script>
	import {
		rechargeRoutine,
		rechargeWechat,
		getRechargeApi,
		transferIn,
		appWechat,

	} from '@/api/user.js';
	import {
		member
	} from "../../api/crane.js"
	import {
		wechatQueryPayResult
	} from '@/api/order.js';
	import {
		toLogin
	} from '@/libs/login.js';
	import {
		mapGetters
	} from "vuex";
	// #ifdef MP
	import authorize from '@/components/Authorize';
	// #endif
	import {
		addCompbind,
		addCompanyTips
	} from '@/api/crane.js'
	export default {
		data() {
			return {

				isCreateCom: "",
				isFlag: "select",
				isprice: false,
				imageValue: [],
				confirm: false,
				strs1: "",
				strs2: "",
				strs3: "",
				strs4: "",
				strs5: "",
				strs6: "",
				strs7: "",
				strs8: "",
				strs9: "",
				strs10: "",
				formData: {
					company: "",
					province: "",
					city: "",
					addDetailes: "",
					atten: "",
					phone: "",
					introduce: "",
					logo: "",
					qualification: "",
					area: "",
					adds: "",
					area: "",
					atten: "",
					authend: "",
					authstart: "",
					city: "",
					distince: 0,
					id: 0,
					introduce: "",
					isauthentication: "",
					latitude: "",
					logo: "",
					longitude: "",
					name: "",
					phone: "",
					province: "",
					qualification: "",
					status: "",
					street: "",
					userid: this.$store.state.app.uid,
					visits: 0
				},
				address: '',

				imageStyles: {
					width: 120,
					height: 120,
					border: {
						color: "#D3D3D3",
						width: 1,
						style: 'dashed',
						radius: '8upx'
					},
					backgroundcolor: '#f7f7f7'
				},
				current: 0,
				widthLen: 0,
				loading: false,
				pay_close: false,
				loadend: false,
				loadTitle: '加载更多', //提示语
				page: 1,
				limit: 20,
				price: "",
				price1: "",
				ids: "",
				num: "",
				expList: [],
				now_money: 0,
				navRecharge: ['账户充值', '佣金转入'],
				active: 0,
				number: '',
				placeholder: "0.00",
				from: '',
				isAuto: false, //没有授权的不会自动授权
				isShowAuth: false, //是否隐藏授权
				picList: [],
				activePic: 0,
				money: "",
				numberPic: '',
				rechar_id: 0,
				rechargeAttention: []

			}
		},
		onLoad() {

			member(this.$store.state.app.uid, this.isFlag).then(res => {

				// if(res.data.isCreateCom==0){
				this.isCreateCom = res.data.isCreateCom
				// var str = res.data.isCreateCom;
				// var str1 = ids.match(/name=(\S*), logo/)[1];
				console.log(123, res.data.isCreateCom)
				var str = res.data.isCreateCom
				var str1 = str.match(/name=(\S*), logo/)[1];
				this.strs1 = str.match(/name=(\S*), logo/)[1];
				this.formData.company = str1
				console.log(1234, str1)
				var str2 = str.match(/province=(\S*), city/)[1];
				var str3 = str.match(/city=(\S*), area/)[1];
				var str4 = str.match(/area=(\S*), street/)[1];
				this.strs2 = str.match(/province=(\S*), city/)[1];
				this.strs3 = str.match(/city=(\S*), area/)[1];
				this.strs4 = str.match(/area=(\S*), street/)[1];
				this.formData.province = str2
				this.formData.city = str3
				this.formData.area = str4
				var str5 = str.match(/adds=(\S*), longitude/)[1];
				var str6 = str.match(/atten=(\S*), phone/)[1];
				var str7 = str.match(/phone=(\S*), status/)[1];
				var str8 = str.match(/introduce=(\S*), qualification/)[1];
				var str9 = str.match(/logo=(\S*), introduce/)[1];
				var str10 = str.match(/qualification=(\S*), province/)[1];
				this.strs5 = str.match(/adds=(\S*), longitude/)[1];
				this.strs6 = str.match(/atten=(\S*), phone/)[1];
				this.strs7 = str.match(/phone=(\S*), status/)[1];
				this.strs8 = str.match(/introduce=(\S*), qualification/)[1];
				this.strs9 = str.match(/logo=(\S*), introduce/)[1];
				this.strs10 = str.match(/qualification=(\S*), province/)[1];
				this.formData.addDetailes = str5
				this.formData.atten = str6
				this.formData.phone = str7
				this.formData.introduce = str8
				this.formData.logo = str9
				this.formData.qualification = str10


				// }
			})
		},
		onReady() {
			this.$refs.form.setRules(this.rules);
			this.formData.userid = this.$store.state.app.uid;
		},
		methods: {
			
			picCharge(idx, item) {

				this.ids = idx,
					console.log(item)
				this.price1 = item.price

				this.activePic = idx;
				if (item === undefined) {
					this.rechar_id = 0;
					this.numberPic = "";
				} else {
					this.money = "";
					this.rechar_id = item.id;
					this.numberPic = item.price;
				}
			},
			getRecharge() {
				getRechargeApi()
					.then(res => {
						console.log(res)
						this.picList = res.data.rechargeQuota;
						if (this.picList[0]) {
							this.rechar_id = this.picList[0].id;
							this.numberPic = this.picList[0].price;
						}
						this.rechargeAttention = res.data.rechargeAttention || [];
					})
					.catch(res => {
						this.$dialog.toast({
							mes: res
						});
					});
			},
			onLoadFun: function() {
				this.getRecharge();
			},
			// 授权关闭
			authColse: function(e) {
				this.isShowAuth = e
			},
			navRecharges: function(index) {
				this.active = index;
			},
			/*
			 * 用户充值
			 */
			submitSub: function(e) {
				let that = this
				let value = e.detail.value.number;
				// 转入余额
				if (that.active) {
					if (parseFloat(value) < 0 || parseFloat(value) == NaN || value == undefined || value == "") {
						return that.$util.Tips({
							title: '请输入金额'
						});
					}
					uni.showModal({
						title: '转入余额',
						content: '转入余额后无法再次转出，确认是否转入余额',
						success(res) {
							if (res.confirm) {
								transferIn({
									price: parseFloat(value)
								}).then(res => {
									that.$store.commit("changInfo", {
										amount1: 'brokeragePrice',
										amount2: that.$util.$h.Sub(that.userInfo
											.brokeragePrice, parseFloat(value))
									});
									return that.$util.Tips({
										title: '转入成功',
										icon: 'success'
									}, {
										tab: 5,
										url: '/pages/users/user_money/index'
									});
								}).catch(err => {
									return that.$util.Tips({
										title: err
									});
								})
							} else if (res.cancel) {
								return that.$util.Tips({
									title: '已取消'
								});
							}
						},
					})
				} else {
					uni.showLoading({
						title: '正在支付',
					})

					// let money = parseFloat(this.money);
					let money = "0.01"
					if (this.rechar_id == 0) {
						if (Number.isNaN(money)) {
							return that.$util.Tips({
								title: '充值金额必须为数字'
							});
						}
						if (money <= 0) {
							return that.$util.Tips({
								title: '充值金额不能为0'
							});
						}
						if (money > 50000) {
							return that.$util.Tips({
								title: '充值金额最大值为50000'
							});
						}
					} else {
						money = this.numberPic

						console.log("签署", this.numberPic)
					}
					// #ifdef MP
					rechargeRoutine({
						price: "0.01",
						type: 0,
						rechar_id: that.rechar_id,
						vipType: "dbvip",
						userId: this.$store.state.app.uid,
						payVipDay: 100
					}).then(res => {
						uni.hideLoading();
						let jsConfig = res.data.data.jsConfig;

						uni.requestPayment({

							timeStamp: jsConfig.timeStamp,
							nonceStr: jsConfig.nonceStr,
							package: jsConfig.packages,
							signType: jsConfig.signType,
							paySign: jsConfig.paySign,
							success: function(res) {
								addCompbind({
									...that.formData
								}).then(res => {


									setTimeout(function() {
										uni.showToast({
											title: "入驻成功"
										})
									}, 1000)
									uni.navigateBack(1)
									console.log('addCompbind---- 这里接口存在问题', res);
								}).finally(() => {
									that.confirm = true;
								});
								// uni.navigateBack(1)
								that.$store.commit("changInfo", {
									amount1: 'nowMoney',
									// amount2: that.$util.$h.Add(value, that.userinfo.nowMoney)
								});

								//that.$set(that, 'userinfo.nowMoney', that.$util.$h.Add(value, that.userinfo.nowMoney));
								return that.$util.Tips({
									title: '支付成功',
									icon: 'success'
								}, {
									tab: 5,
									// url: '/pages/users/user_money/index'
								});
							},
							fail: function(err) {
								return that.$util.Tips({
									title: '支付失败'
								});
							},
							complete: function(res) {
								if (res.errMsg == 'requestPayment:cancel') return that.$util.Tips({
									title: '取消支付'
								});
							}
						})
					}).catch(err => {
						uni.hideLoading();
						return that.$util.Tips({
							title: err
						})
					});
					// #endif
					// #ifdef H5 
					rechargeWechat({
						price: "0.01",
						from: that.from,
						rechar_id: that.rechar_id,
						vipType: "dbvip",
						payVipDay: 100,
						userId: this.$store.state.app.uid,
						payType: 0
					}).then(res => {
						let jsConfig = res.data.jsConfig;
						let orderNo = res.data.orderNo;
						let data = {
							timestamp: jsConfig.timeStamp,
							nonceStr: jsConfig.nonceStr,
							package: jsConfig.packages,
							signType: jsConfig.signType,
							paySign: jsConfig.paySign
						};
						if (that.from == "weixinh5") {
							let domain = encodeURIComponent(location.href.split('/pages')[0]);
							let urls = jsConfig.mwebUrl + '&redirect_url=' + domain +
								'/pages/users/user_money/index';
							location.replace(urls);
							return that.$util.Tips({
								tab: 5,
								url: '/pages/users/user_money/index'
							});
							// return that.$util.Tips({
							// 	title: '支付成功',
							// 	icon: 'success'
							// }, {
							// 	tab: 5,
							// 	url: '/pages/users/user_money/index'
							// });
						} else {
							that.$wechat.pay(data)
								.finally(() => {
									that.$store.commit("changInfo", {
										amount1: 'nowMoney',
										// amount2: that.$util.$h.Add(value, that.userinfo.nowMoney)
									});
									// that.$set(that, 'userinfo.nowMoney', that.$util.$h.Add(value, that.userinfo.nowMoney));
									wechatQueryPayResult(orderNo).then(res => {
										return that.$util.Tips({
											title: '支付成功',
											icon: 'success'
										}, {
											tab: 5,
											url: '/pages/users/user_money/index'
										});
									}).cache(err => {
										return that.$util.Tips({
											title: err
										});
									})
								})
								.catch(function(err) {
									return that.$util.Tips({
										title: '支付失败'
									});
								});
						}
					}).catch(res => {
						uni.hideLoading();
						return that.$util.Tips({
							title: res
						});
					})
					// #endif
				}
			},




			// 获取上传状态
			select(type, e) {
				console.log('选择文件：', type, e);
				this.formData[type] = e.tempFilePaths[0];
			},
			// 获取上传进度
			progress(e) {
				console.log('上传进度：', e)
			},

			// 上传成功
			success(e) {
				console.log('上传成功')
			},

			// 上传失败
			fail(e) {
				console.log('上传失败：', e)
			},
			birthChange(e) {
				console.log(e)
			},
			change(name, value) {
				this.formData.checked = value
				this.$refs.form.setValue(name, value)
			},
			getphonenumber(e) {
				console.log('getphonenumber---', e);
			},
			/**
			 * 手动提交
			 * @param {Object} form
			 */
			submitForm(form) {

				const formData = this.formData;
				console.log(131, formData)
				const re = /^[1][3,4,5,7,8,9][0-9]{9}$/;
				if (!formData.company) {
					return uni.showToast({
						title: '请输入公司名称',
						icon: 'none'
					})
				} else if (!formData.province) {
					return uni.showToast({
						title: '请选择省-市-区',
						icon: 'none'
					})
				} else if (!formData.addDetailes) {
					return uni.showToast({
						title: '请输入公司详细地址',
						icon: 'none'
					})
				} else if (!formData.atten) {
					return uni.showToast({
						title: '请输入联系人',
						icon: 'none'
					})
				} else if (!formData.phone) {
					return uni.showToast({
						title: '请输入联系电话',
						icon: 'none'
					})
				} else if (!re.test(formData.phone)) {
					return uni.showToast({
						title: '手机号输入不正确',
						icon: 'none'
					})
				} else if (!formData.introduce) {
					return uni.showToast({
						title: '请输入公司简介',
						icon: 'none'
					})
				} else if (!formData.logo) {
					return uni.showToast({
						title: '请上传公司LOGO',
						icon: 'none'
					})
				} else if (!formData.qualification) {
					return uni.showToast({
						title: '请上传公司资质',
						icon: 'none'
					})
				}
				console.log("测试", this.formData.company)
				console.log("测试1", this.strs1)
				if (this.isCreateCom !== 0) {
					console.log("一")
					uni.showModal({
						title: "一个用户只能入驻一个公司"
					})
				}
				if (this.isCreateCom == 0) {
					this.isprice = true
				}

				this.formData.adds = formData.addDetailes;
				this.formData.name = formData.atten;

				// {
				// 	adds: "",
				// 	area: "",
				// 	atten: "",
				// 	authend: "",
				// 	authstart: "",
				// 	city: "",
				// 	distince: 0,
				// 	id: 0,
				// 	introduce: "",
				// 	isauthentication: "",
				// 	latitude: "",
				// 	logo: "",
				// 	longitude: "",
				// 	name: "",
				// 	phone: "",
				// 	province: "",
				// 	qualification: "",
				// 	status: "",
				// 	street: "",
				// 	userid: "",
				// 	visits: 0
				// }


			},

			/**
			 * 清除表单校验
			 * @param {Object} form
			 * @param {Object} name
			 */
			clearValidate(form, name) {
				if (!name) name = []
				this.$refs[form].clearValidate(name)
			},
			// 获取地址信息
			selCity: function(e) {
				const [province, city, area] = e.target.value;
				this.formData.province = province;
				this.formData.city = city;
				this.formData.area = area;
			},
			picker: function() {
				document.blur();
			},
			cancelConfirm: function() {
				this.confirm = false;
			},
			confirmModal: function() {
				uni.showToast({
					title: '调试阶段暂未开启支付功能',
					icon: 'none'
				})
			}
		}
	}
</script>

<style lang="scss">
	.index {
		background-color: #FFFFFF;
		padding: 20upx 20upx 60upx;

		.formItem {
			&.border-none {
				.uni-forms-item {
					border: none;
				}
			}

			.uni-forms-item {
				padding-top: 12upx;
				border-bottom: 1px solid #CCCCCC;

				.uni-forms-item__inner {
					padding-bottom: 0;
					height: 72upx;
				}

				.uni-forms-item__label {
					height: 72upx;

					text {
						font-size: 28upx;
						color: #212121;
					}
				}

				.uni-forms-item__content {
					height: 72upx;
				}

				.uni-input {
					border: none;
					height: 72upx;
				}

				.addText {
					height: 72upx;
					line-height: 72upx;
					color: #808080;

					&.active {
						color: #212121;
					}
				}
			}
		}

		.tips {
			display: block;
			height: 30upx;
			margin-top: 24upx;
			font-family: PingFang-SC-Medium;
			font-size: 22upx;
			color: #F05B5B;
			letter-spacing: 0;
			text-align: left;
			font-weight: 500;
		}

		.button {
			width: 481upx;
			height: 85upx;
			line-height: 84upx;
			background: #0081FF;
			color: #FFFFFF;
			border-radius: 8upx;
			font-family: PingFang-SC-Bold;
			font-size: 30upx;
			color: #FFFFFF;
			letter-spacing: 0;
			text-align: left;
			font-weight: 700;
			text-align: center;
			margin: 40upx auto;
			padding-bottom: 50upx;
		}

		.uni-textarea {
			display: block;
			width: 100%;
			padding: 16upx 18upx;
			border: 1px solid #CCCCCC;
			border-radius: 8upx;
			box-sizing: border-box;
		}

		.modal {
			position: fixed;
			width: 100%;
			height: 100%;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			background-color: rgba(0, 0, 0, 0.24);
			z-index: 999;
			display: flex;
			align-items: center;
			justify-content: center;

			.modal-box {
				width: 583upx;
				background: #FFFFFF;
				box-shadow: 0px 0px 16upx 0upx rgba(0, 0, 0, 0.14);
				border-radius: 8upx;
				overflow: hidden;

				.content {
					height: 220upx;
					padding: 55upx 47upx;

					text {
						line-height: 40upx;
						font-size: 28upx;
						color: #212121;
					}
				}

				.button-box {
					display: flex;
					height: 78upx;
					align-items: stretch;

					button {
						line-height: 78upx;
						margin: 0;
						flex: 0 0 50%;
						height: 100%;
						font-size: 28upx;
						border-radius: 0;

						&.cancel {
							color: #212121;
						}

						&.confirm {
							color: #fff;
							background-color: #0081FF;
						}
					}
				}
			}
		}
	}
</style>
